<div class="network-container">
    <div class="layui-card">
        <div class="layui-card-header">网络探测工具</div>
        <div class="layui-card-body">
            <form class="layui-form">
                <div class="layui-form-item">
                    <label class="layui-form-label">目标IP</label>
                    <div class="layui-input-inline">
                        <input type="text" id="ip" name="ip" placeholder="请输入IP地址" class="layui-input" value="8.8.8.8">
                    </div>
                    <div class="layui-form-mid layui-word-aux">例如: 8.8.8.8</div>
                </div>
                
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">Ping次数</label>
                        <div class="layui-input-inline" style="width: 100px;">
                            <input type="number" id="pingCount" name="pingCount" value="4" min="1" max="10" class="layui-input">
                        </div>
                        <button type="button" class="layui-btn" id="btnPing">执行Ping</button>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">端口探测</label>
                        <div class="layui-input-inline" style="width: 100px;">
                            <input type="number" id="port" name="port" placeholder="端口" min="1" max="65535" class="layui-input" value="80">
                        </div>
                        <button type="button" class="layui-btn" id="btnPortScan">单次探测</button>
                        <button type="button" class="layui-btn layui-btn-danger" id="btnContinuous">持续探测</button>
                        <button type="button" class="layui-btn layui-btn-primary" id="btnStop" style="display:none">停止</button>
                    </div>
                </div>
            </form>
            
            <div class="result-box">
                <div class="layui-tab">
                    <ul class="layui-tab-title">
                        <li class="layui-this">Ping结果</li>
                        <li>端口探测结果</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <pre id="pingResult" class="result-pre">等待执行Ping命令...</pre>
                        </div>
                        <div class="layui-tab-item">
                            <pre id="portResult" class="result-pre">等待端口探测结果...</pre>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>